// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));

var labelfontcolor = "#f3f878" //省份标签字体颜色
var labellightfontcolor = "#d05848" //省份标签字体选中时颜色
var itemareacolor = "#6d58f030" //省份颜色
var itemareacolorlight = "#4155b9a0" //省份选中时颜色
var itembordercolor = "#389dff" //省份边界颜色
var itemshadowcolor = "#556e75" //省份阴影颜色
var pointcolor = "#68bd0a" //点颜色
var bgcolor = "#0d005900" //背景颜色

// 指定图表的配置项和数据
var name_title = "长岭中学2022届四班同学录"
var mapName = 'china'
var data = [
    { name: "杨佳铭", school: "海南师范大学", city: "Hai Nan"},
    { name: "樊俊岩", school: "西安邮电大学", city: "Shann Xi"},
    { name: "郜子恒", school: "南华大学", city: "Hu Nan"},
    { name: "王嘉姿", school: "西安医学院", city: "Shann Xi"},
    { name: "屈晨宇", school: "新疆大学", city: "Xin Jiang"},
    { name: "侯沣宾", school: "新疆大学", city: "Xin Jiang"},
    { name: "朱子铭", school: "云南大学", city: "Yun Nan"},
    { name: "赵娅丹", school: "宁波工程学院", city: "Zhe Jiang"},
    { name: "罗昱晨", school: "西安工程大学", city: "Shann Xi"},
    { name: "李雨欣", school: "西安理工大学", city: "Shann Xi"},
    { name: "杨昊天", school: "湖南中医药大学", city: "Hu Nan"},
    { name: "王智威", school: "西安理工大学", city: "Shann Xi"},
    { name: "赵升", school: "南京理工大学", city: "Jiang Su"},
    { name: "朱亦彤", school: "西南石油大学", city: "Si Chuan"},
    { name: "阚运卿", school: "西安邮电大学", city: "Shann Xi"},
    { name: "李青儒", school: "西南石油大学", city: "Si Chuan"},
    { name: "冯文杰", school: "西安石油大学", city: "Shann Xi"},
    { name: "焦亚娟", school: "西安医学院", city: "Shann Xi"},
    { name: "周欣怡", school: "陕西师范大学", city: "Shann Xi"},
    { name: "张钰彤", school: "西安医学院", city: "Shann Xi"},
    { name: "邵羽洁", school: "陕西中医药大学", city: "Shann Xi"},
    { name: "郭振宇", school: "江西中医药大学", city: "Jiang Xi"},
    { name: "杨择楠", school: "陕西理工大学", city: "Shann Xi"},
    { name: "朱紫烨", school: "西北农林科技大学", city: "Shann Xi"},
    { name: "王心阳", school: "宁夏大学", city: "Ning Xia"},
    { name: "梁硕", school: "湖南科技大学", city: "Hu Nan"},
    { name: "王泽树", school: "西安建筑科技大学", city: "Shann Xi"},
    { name: "高欣", school: "陕西科技大学", city: "Shann Xi"},
    { name: "张昕文", school: "西安科技大学", city: "Shann Xi"},
    { name: "寇田田", school: "西安工程大学", city: "Shann Xi"},
    { name: "段瑞馨", school: "长安大学", city: "Shann Xi"},
    { name: "唐皓", school: "西安科技大学", city: "Shann Xi"},
    { name: "贾宗悦", school: "西安邮电大学", city: "Shann Xi"},
    { name: "宋家成", school: "南京工业大学", city: "Jiang Su"},
    { name: "王飞凡", school: "太原理工大学", city: "Shan Xi"},
    { name: "寇田田", school: "西安工程大学", city: "Shann Xi"},
    { name: "寸沛雯", school: "西安邮电大学", city: "Shann Xi"},
    { name: "王一方", school: "西安科技大学", city: "Shann Xi"},
    { name: "邹琪", school: "西安财经大学", city: "Shann Xi"},
    { name: "高佳豪", school: "西安工业大学", city: "Shann Xi"},
    { name: "张京龙", school: "长安大学", city: "Shann Xi"},
    { name: "陈正洋", school: "武警工程大学", city: "Shann Xi"},
    { name: "周芷荣", school: "山西财经大学", city: "Shan Xi"},
    { name: "党秉航", school: "西安电子科技大学", city: "Shann Xi"},
    { name: "张璇", school: "西安邮电大学", city: "Shann Xi"}
];

function getHTML(x) {
    var flag = 0;
    console.log(x);
    if (typeof(x) != "string")
        return null;
    var res = "";
    for (var i in data) {
        if (data[i].city == x) {
            if (!flag)
                flag = 1;
            else
                res += "<br>";
            res += "<sup>" + data[i].name + "  |  " + data[i].school + "</sup>";
        }
    }
    return res === "" ? "暂无" : res;
}

var option = {
    backgroundColor: bgcolor,
    title: {
        text: name_title,
        x: 'center',
        y: 20,
        shadowColor: "rgba(0, 0, 0, 0.5)",
        textStyle: {
            fontSize: 24,
            color: "#ffffff",
        },
    },
    tooltip: {
        trigger: 'item',
        textStyle: {
            fontSize: 15
        },
        formatter: function (params) {
            var toolTiphtml = ''
            /*params.seriesName params.name params.value[0]*/
            if (params.value[0] === 253) {
                toolTiphtml = getHTML("Xin Jiang");
            } // Xin Jiang
            if (params.value[0] === 266) {
                toolTiphtml = getHTML("Xi Zang");
            } // Xi Zang
            if (params.value[0] === 394) {
                toolTiphtml = getHTML("Gan Su");
            } // Gan Su
            if (params.value[0] === 347) {
                toolTiphtml = getHTML("Qing Hai");
            } // Qing Hai
            if (params.value[0] === 468) {
                toolTiphtml = getHTML("Si Chuan");
            } // Si Chuan
            if (params.value[0] === 446) {
                toolTiphtml = getHTML("Yun Nan");
            } // Yun Nan
            if (params.value[0] === 515) {
                toolTiphtml = getHTML("Nei Meng Gu");
            } // Nei Meng Gu
            if (params.value[0] === 513) {
                toolTiphtml = getHTML("Ning Xia");
            } // Ning Xia
            if (params.value[0] === 548) {
                toolTiphtml = getHTML("Chong Qing");
            } // Chong Qing
            if (params.value[0] === 531) {
                toolTiphtml = getHTML("Gui Zhou");
            } // Gui Zhou
            if (params.value[0] === 561) {
                toolTiphtml = getHTML("Guang Xi");
            } // Guang Xi
            if (params.value[0] === 629) {
                toolTiphtml = getHTML("Guang Dong");
            } // Guang Dong
            if (params.value[0] === 559) {
                toolTiphtml = getHTML("Hai Nan");
            } // Hai Nan
            if (params.value[0] === 547) {
                toolTiphtml = getHTML("Shann Xi");
            } // Shann Xi
            if (params.value[0] === 569) {
                toolTiphtml = getHTML("Hu Bei");
            } // Hu Bei
            if (params.value[0] === 578) {
                toolTiphtml = getHTML("Hu Nan");
            } // Hu Nan
            if (params.value[0] === 591) {
                toolTiphtml = getHTML("Shan Xi");
            } // Shan Xi
            if (params.value[0] === 607) {
                toolTiphtml = getHTML("He Nan");
            } // He Nan
            if (params.value[0] === 638) {
                toolTiphtml = getHTML("Jiang Xi");
            } // Jiang Xi
            if (params.value[0] === 659) {
                toolTiphtml = getHTML("Fu Jian");
            } // Fu Jian
            if (params.value[0] === 691) {
                toolTiphtml = getHTML("Tai Wan");
            } // Tai Wan
            if (params.value[0] === 630) {
                toolTiphtml = getHTML("He Bei");
            } // He Bei
            if (params.value[0] === 639) {
                toolTiphtml = getHTML("Bei Jing");
            } // Bei Jing
            if (params.value[0] === 651) {
                toolTiphtml = getHTML("Tian Jin");
            } // Tian Jin
            if (params.value[0] === 638) {
                toolTiphtml = "由于山东人口太多，请移步至左下角圆点查看";
            } // Shan Dong
            if (params.value[0] == 0) {
                toolTiphtml = getHTML("Shan Dong");
            } // Shan Dong New
            if (params.value[0] === 645) {
                toolTiphtml = getHTML("An Hui");
            } // An Hui
            if (params.value[0] === 687) {
                toolTiphtml = getHTML("Zhe Jiang");
            } // Zhe Jiang
            if (params.value[0] === 703) {
                toolTiphtml = getHTML("Shang Hai");
            } // Shang Hai
            if (params.value[0] === 668) {
                toolTiphtml = getHTML("Jiang Su");
            } // Jiang Su
            if (params.value[0] === 780) {
                toolTiphtml = getHTML("Hei Long Jiang");
            } // Hei Long Jiang
            if (params.value[0] === 728) {
                toolTiphtml = getHTML("Ji Lin");
            } // Ji Lin
            if (params.value[0] === 732) {
                toolTiphtml = getHTML("Liao Ning");
            } // Liao Ning
            // console.log(toolTiphtml)
            return toolTiphtml;
        }
        // axisPointer: {
        //     show: false, //开发时用于取某个坐标点用
        //     type: 'cross',
        //     lineStyle: {
        //         type: 'dashed',
        //         width: 1
        //     }
        // }
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    geo: {
        show: true,
        map: mapName,
        label: {
            normal: {
                show: true,
                fontSize: 10,
                color: labelfontcolor
            },
            emphasis: {
                show: false,
                color: labellightfontcolor,
                fontSize: 20
            }
        },
        roam: false, //不允许缩放，散点图太娇气了
        zoom: 1.6,
        center: [105, 36], // 调整地图位置
        itemStyle: {
            normal: {
                areaColor: itemareacolor,
                borderColor: itembordercolor,
                borderWidth: 1, //设置外层边框
                shadowBlur: 5,
                shadowOffsetY: 8,
                shadowOffsetX: 0,
                shadowColor: itemshadowcolor
            },
            emphasis: {
                areaColor: itemareacolorlight,
                shadowOffsetX: 0,
                shadowOffsetY: 0,
                shadowBlur: 5,
                borderWidth: 0,
                shadowColor: "rgba(0, 0, 0, 0.5)"
            }
        }
    },
    xAxis: {
        show: false,
        min: 0,
        max: 1000
    },
    yAxis: {
        show: false,
        min: 0,
        max: 1000
    },
    series: [
        {
            type: 'map',
            map: mapName,
            geoIndex: 0,
            coordinateSystem: 'geo', // 坐标系为地理坐标系
            animation: true,
            data: data
        },
        {
            symbolSize: 20,
            symbol: 'circle',
            data: [
                //[0,0], //左下角点                    
                [253, 567], // Xin Jiang
                [266, 364], // Xi Zang
                [394, 629], // Gan Su
                [347, 512], // Qing Hai
                [468, 388], // Si Chuan
                [446, 117], // Yun Nan
                [515, 660], // Nei Meng Gu
                [513, 578], // Ning Xia
                [548, 360], // Chong Qing
                [531, 260], // Gui Zhou
                [561, 162], // Guang Xi
                [629, 131], // Guang Dong
                [559, 3], // Hai Nan
                [547, 445], // Shan Xi
                [569, 391], // Hu Bei
                [578, 284], // Hu Nan
                [591, 598], // Shan Xi
                [607, 479], // He Nan
                [638, 278], // Jiang Xi
                [659, 237], // Fu Jian
                [691, 123], // Tai Wan
                [630, 580], // He Bei
                [639, 635], // Bei Jing
                [651, 596], // Tian Jin
                [638, 479], // Shan Dong
                [645, 419], // An Hui
                [687, 330], // Zhe Jiang
                [703, 359], // Shang Hai
                [668, 448], // Jiang Su
                [780, 837], // Hei Long Jiang
                [728, 773], // Ji Lin
                [732, 684] // Liao Ning
                //[1000,1000] //右上角点
            ],
            type: 'scatter',
            itemStyle: {
                color: pointcolor
            }
        },
        {
            symbolSize: 20,
            symbol: 'circle',
            data: [
                [0, 0], //左下角点                    
            ],
            type: 'scatter',
            itemStyle: {
                color: pointcolor
            }
        }
    ]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);